<template>
  <el-row>
    <el-col :span="11">
      <el-breadcrumb separator="/" style="margin: 0 0 20px 0">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>评论</el-breadcrumb-item>
      </el-breadcrumb>
      <el-input placeholder="请输入名称" size="small" style="width: 40%" v-model.trim="sousuo"></el-input>
      <el-button type="primary" size="small" @click="sousuoid()">搜索</el-button>
    </el-col>
    <el-col :span="11" >
      <h1>评论</h1>
    </el-col>

    <el-col :span="24" style="margin:  10px 0 3% 0">
      <el-table
        :data="plData"
        style="width: 100%;">
        <el-table-column
          type="selection"
          width="55">
        </el-table-column>
        <el-table-column
          prop="number"
          label="评论ID">
        </el-table-column>
        <el-table-column
          prop="ascriptionId"
          label="评论对象">
        </el-table-column>
        <el-table-column
          prop="name"
          label="评论对象名">
        </el-table-column>
        <el-table-column
          prop="content"
          label="评论内容">
        </el-table-column>
        <el-table-column
          prop="commentStatus"
          label="评论状态"
          sortable>
        </el-table-column>
        <el-table-column
          prop="auditStatus"
          label="审核状态"
          sortable>
        </el-table-column>
        <el-table-column
          fixed="right"
          label="操作"
          width="180">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="lookctComment(scope.$index, scope.row)">查看</el-button>
            <el-button type="text" size="small" v-if="scope.row.auditStatus==='未审核'" @click="shComment(scope.$index, scope.row)">审核</el-button>
            <el-button type="text" size="small" v-if="scope.row.auditStatus==='已审核'" >已审核</el-button>
            <el-button type="text" size="small" v-if="scope.row.commentStatus==='已精选'">精选</el-button>
            <el-button type="text" size="small" v-if="scope.row.commentStatus==='未精选'" @click="jxComment(scope.$index, scope.row)">普通</el-button>
            <el-button type="text" size="small" @click="delctComment(scope.$index, scope.row)">删除</el-button>

          </template>
        </el-table-column>
      </el-table>
    </el-col>

    <el-col :span="24" style="text-align: center">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage4"
        :page-sizes="[5,10]"
        :page-size="5"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
      </el-pagination>
      <el-dialog title="查看评论" :visible.sync="dialogFormLook">
        <el-form :model="formLook" style="width: 80%">
          <el-form-item label="评论人 :" label-width="20%">
            <el-input v-model="formLook.name"></el-input>
          </el-form-item>
          <el-form-item label="评论内容 :" label-width="20%">
            <el-input v-model="formLook.content"></el-input>
          </el-form-item>
          <el-form-item label="评论物id :" label-width="20%">
            <el-input v-model="formLook.ascriptionId"></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="dialogFormLook = false">取 消</el-button>
          <el-button type="primary" @click="dialogFormLook = false">确 定</el-button>
        </div>
      </el-dialog>
    </el-col>
  </el-row>
</template>

<script>
  import {getcomment,delcomment,selected,audit,getcommentid,ctqueryid} from "@/api/commentApi";

  export default {
    data() {
      return {
        dialogFormLook:false,
        currentPage4:1,
        total:10,
        size:5,
        page:1,
        sousuo:'',
        formLook:{
          name:'',
        },
        plData: [],
      }
    },
    methods: {
      getctComment(){
        let data={
          page:this.page,
          size:this.size
        };
        this.plData=[];
        getcomment(data).then((res)=>{
          res.data.data.content.forEach((value)=>{
            if(value.name!=null){
              value.name=decodeURIComponent(value.name);
            }
            if(value.auditStatus===3){
              value.auditStatus='未审核';
            }else if(value.auditStatus===4){
              value.auditStatus='已审核';
            }
            if(value.commentStatus===5){
              value.commentStatus='未精选';
            }else if(value.commentStatus===6){
              value.commentStatus='已精选';
            }

            if(value.ascriptionId!=null){
              let a=value.ascriptionId.substring(value.ascriptionId.length-3);
              switch (a){
                case 'A01':
                  value.ascriptionId='代表公司';
                  break;
                case 'A04':
                  value.ascriptionId='标的物';
                  break;
              }
            }
          });

          if(this.sousuo!==''){
            let data={number:this.sousuo};
            ctqueryid(data).then((res)=>{
              if(res.data.data!=null){
                let a=res.data.data;
                this.plData.push(a);
              }
            })
          }else{
            this.plData = res.data.data.content;
          }
          this.total=res.data.data.totalElements;
        })
      },
      delctComment(index,row){
        let data={commentid:row.id};
        delcomment(data).then((res)=>{
          this.getctComment();
          this.$message({
            message: '删除成功!',
            type: 'success'
          });
        })
      },
      lookctComment(index,row){
        let data={commentid:row.id};
        getcommentid(data).then((res)=>{
          this.formLook=res.data.data;
          this.dialogFormLook = true;
        })
      },
      shComment(index,row){
        let data={commentid:row.id};
        audit(data).then((res)=>{
          this.$confirm('确认审核通过吗?', '提示', {
            type: 'warning'
          }).then(() => {
            this.getctComment();
            this.$message({
              message: '审核成功!',
              type: 'success'
            });
          }).catch(() => {
          });

        });
      },
      jxComment(index,row){
        let data={commentid:row.id};
        this.$confirm('只能修改一次精选不能再设置普通, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          selected(data).then((res)=>{
            this.getctComment();
            this.$message({
              type: 'success',
              message: '设置成功!'
            });
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消'
          });
        });
      },
      sousuoid(){
        this.getctComment();
      },

      handleSizeChange(val) {
        this.size=val;
        this.getctComment();
      },
      handleCurrentChange(val) {
        this.page=val;
        this.getctComment();
      }
    },
    mounted(){
      this.getctComment();
    },
  }
</script>

<style scoped>


</style>
